<template>
  <div>
    <h1>js常见的数据操作, find, filter, map, sort</h1>
    <div>
      {{ get_person('lisi') }}
    </div>
    <div>
      {{ get_person_age(20) }}
    </div>
    <div>
      {{ get_person_age_count() }}
    </div>
    <div>
      {{ persons_sort() }}
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      persons: [
        {
          name: 'zhangsan',
          age: 29
        },
        {
          name: 'lisi',
          age: 18
        },
        {
          name: 'wangwu',
          age: 25
        },
        {
          name: 'zhaoliu',
          age: 16
        },
      ]
    }
  },
  methods: {
    get_person(name) {
      return this.persons.find(p => p.name == name)
    },
    get_person_age(age) {
      // 大于age的人才要
      return this.persons.filter(p => p.age > age)
    },
    get_person_age_count() {
      var age_count = 0
      this.persons.map(p => age_count += p.age)
      return age_count
    },
    persons_sort() {
      // a, b 两个人, 
      // 返回 0, 代表两个人相同,  返回正值, 代表a大于b
      // 返回 负值, 代表a<b
      var person_sorted = this.persons.sort((a, b) => { return a.age - b.age})  // 小的靠前
      // var person_sorted = this.persons.sort((a, b) => { return b.age - a.age })  // 大的靠前
      return person_sorted
    }

  }
}
</script>